<template>
  <div style="height: 100%; overflow-y: auto">
    <div v-for="i in 10" class="item" @click="handler(i)">
      <el-avatar />
      <div class="iten-text">
        <h4>客户{{ i }}</h4>
        <p>备注信息</p>
      </div>
    </div>
    <!-- <el-empty description="暂无聊天记录" /> -->
  </div>
</template>
<script lang="ts" setup>
const emit = defineEmits(['select']);
const handler = item => {
  emit('select', item);
};
</script>
<style lang="less" scoped>
.list {
  margin: 20px;
}
.item {
  gap: 10px;
  display: flex;
  font-size: 12px;
  align-items: center;
  padding: 10px 10px;
  cursor: pointer;
  &:hover {
    background-color: #f5f5f5;
  }
  .iten-text {
    h4 {
      margin: 0;
      color: #666;
      font-size: 13px;
    }
    p {
      margin: 0;
      color: #aaa;
    }
  }
}
</style>
